<template>
  <el-container style="height: 500px; border: 1px solid #eee">
    <el-container>
      <el-aside class="el-aside" width="200px" style="background-color: #19374b">
        <v-menu/>
      </el-aside>
      <el-main class="elMain">
        <!-- 标题 -->
        <el-row class="lineHight90 margin060">
          <el-breadcrumb separator=">">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/' }">买家中心</el-breadcrumb-item>
            <el-breadcrumb-item>项目管理</el-breadcrumb-item>
          </el-breadcrumb>
        </el-row>
        <div class="width890 marginTop68">
          <el-steps :active="1">
            <el-step title="对接确认" icon="el-icon-edit"></el-step>
            <el-step title="合同确认" icon="el-icon-upload"></el-step>
            <el-step title="执行评价" icon="el-icon-picture"></el-step>
          </el-steps>
        </div>
       <!-- 需求基本信息 -->
        <el-row class="margin060 bgWhite marginTop40">
          <!-- 政策选择 -->
          <el-col :span="21" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">政策选择</el-row>
            <el-row>
              <el-col :span="8" class="marginTB20 marginTop20">
                <span class="itemTitle">项目名称</span> ：<span class="itemContent colorc1">苏州工业区储能项目 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">项目类型</span> ：<span class="itemContent colorc1">建设安装 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">专业类型</span> ：<span class="itemContent colorc1">电气-储能 </span>
              </el-col>
            </el-row>
          </el-col>
          <!-- 供应商信息 -->
          <el-col :span="21" class="maginLeft170 width1186 height222 bgAppcation">
            <el-row :gutter="20">
              <el-col :span="3" :offset="1" class="font24 colorWhite marginTop96">申请哪项政策</el-col>
              <el-col :span="10">
                <el-radio-group v-model="application" class="marginTop52 colorWhite">
                  <el-row class="lineHight40">
                    <el-radio :label="1" class="colorWhite">2018年度工业园区节能补贴</el-radio>
                  </el-row>
                  <el-row class="lineHight40">
                    <el-radio :label="2" class="colorWhite">不列下一年度入有序用电名单</el-radio>
                  </el-row>
                  <el-row class="lineHight40">
                    <el-radio :label="3" class="colorWhite">苏州市节能改造项目补贴</el-radio>
                  </el-row>
                </el-radio-group>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <!-- 项目负责人 -->
        <el-row class="margin060 bgWhite marginTop40">
          <el-col :span="20" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">政策公示文件</el-row>
            <el-row>
              <el-table
                :data="tableData3"
                border
                height="250"
                style="width: 100%">
                <el-table-column
                  prop="date"
                  align="center"
                  label="文件名">
                </el-table-column>
                <el-table-column
                  prop="name"
                  align="center"
                  label="联系方式">
                </el-table-column>
                <el-table-column
                  prop="edit"
                  align="center"
                  label="操作">
                  <template slot-scope="scope">
                    <el-button size="small">下载</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-row>
          </el-col>
        </el-row>
        <!-- 申报材料提交 -->
        <el-row class="margin060 bgWhite">
          <el-col :span="20" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">申报材料提交</el-row>
            <el-row>
              <el-table
                :data="projectPlanning"
                border
                height="250"
                style="width: 100%">
                <el-table-column
                  prop="planningdemand"
                  align="center"
                  label="需要提交材料">
                </el-table-column>
                <el-table-column
                  prop="planninguploadFile"
                  align="center"
                  label="已提交文件名">
                  <template slot-scope="planning">
                    <el-button size="small" type="text">{{planning.row.planninguploadFile}}</el-button>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="planningdate"
                  align="center"
                  label="上传人">
                </el-table-column>
                <el-table-column
                  prop="edit"
                  align="center"
                  label="操作">
                  <template slot-scope="scope">
                    <el-button size="small">移除文件</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-row>
          </el-col>
        </el-row>
        <!-- 确认按钮 -->
        <el-row class="margin060 paddingBottom20 marginTop20">
          <el-col :span="24" class="textCenter">
            <el-button type="success">项目确认</el-button>
          </el-col>
        </el-row>
      </el-main>
    </el-container>
  </el-container>
</template>
<style scoped>
.bgAppcation{
  background: url('../../assets/images/application.png') no-repeat;
  margin-bottom: 40px;
}
</style>
<style>
/* .el-radio{
  color: #ffffff;
}
.el-radio_input.is-checked,
.el-radio_label {
    color: #f3f3f3 !important;
}
.el-radio_label{
  color: #ffffff !important;
} */


.el-radio__input.is-checked,
 .el-radio__label{
  color: #f3f3f3 !important;
}
 /* .el-radio__input.is-checked .el-radio__inner {
      border-color: #f3f3f3;
      background: #f3f3f3; }
      .el-radio__input.is-checked .el-radio__inner::after {
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1); }
    .el-radio__input.is-checked + .el-radio__label {
      color: #cccccc; }
    .el-radio__input.is-focus .el-radio__inner {
      border-color: #ffffff; } */
</style>

<script>
import VMenu from '../../layout/default/components/menu'
export default {
  name: "Project",
  components: {
    VMenu
  },
  data() {
    return{
     application:1,//申请选择
     active:1,//步骤
     //公司项目负责人数据
     tableData3: [
          {
            date: '2018年度苏州工业区节能补贴发放评定规则',
            name: '2018-12-01',
            address: '13435663802'
          }
        ],
        //供应商项目策划方案 
        projectPlanning:[
          {
            planningdemand: '项目需求情况',
            planninguploadFile: '文件上传',
            planningdate: '2019-05-06'
          }
        ],
    }
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>

